import React from "react";
import {ScrollView, View} from "react-native";
import chjStyle from "../../../CustomStyle";
import ModuleCommonHeader from "../../module/ModuleCommonHeader";
import SingleSelectionTextItem from "../common/SingleSelectionTextItem";
import InputTextItem from "../common/InputTextItem";
import SwitchTextItem from "../common/SwitchTextItem";
import CommonTextItem from "../common/CommonTextItem";
import CommonMultiListSelection from "../common/CommonMultiListSelection";
import CarFrame from "./CarFrame";
import Util from "../../Util";
import NextButton from "../common/NextButton";
import {Actions} from "react-native-router-flux";

export default class CarConfig extends React.Component
{
    // 构造函数，可执行初始化操作
    constructor(props)
    {
        super(props);
        // 在ES6，在构造函数里初始化state
        this.state = {
        };

        if (!Util.selectCar.carconfig)
        {
            Util.selectCar.carconfig = Util.defaultCarconfig();
        }
    }

    // 组件被加载时
    componentDidMount()
    {

    }

    // 组件即将被卸载时
    componentWillUnmount()
    {
    }

    // 组件被渲染时
    render()
    {
        return(
            <View style={chjStyle.mainContainer}>
                <ModuleCommonHeader title='车辆配置(02)' clickedLeft={this.clickedBack.bind(this)} leftText='返回' clickedRight={this.clickedNew.bind(this)} rightText='保存'/>
                <ScrollView
                    style={chjStyle.mainList}>
                    <SingleSelectionTextItem object={Util.selectCar.carconfig[0]} onSelectedListener={this.onSelected.bind(this)} optionArray={[{name:"黑色"}, {name:"白色"}, {name:"红色"}, {name:"黄色"}, {name:"蓝色"}, {name:"绿色"}, {name:"紫色"}, {name:"银灰"}, {name:"深色"}, {name:"香槟色"}, {name:"棕色"}, {name:"其它"}]}/>
                    <InputTextItem           object={Util.selectCar.carconfig[1]} autoCapitalize={'characters'} keyboardType={'numeric'} maxLength={19} onTextChangedListener={this.onTextChanged.bind(this)}/>
                    <InputTextItem           object={Util.selectCar.carconfig[2]} autoCapitalize={'characters'} keyboardType={'numeric'} maxLength={19} onTextChangedListener={this.onTextChanged.bind(this)}/>
                    <SingleSelectionTextItem object={Util.selectCar.carconfig[3]} onSelectedListener={this.onSelected.bind(this)} optionArray={[{name:"92号汽油"}, {name:"95号汽油"}, {name:"98号汽油"}, {name:"90号汽油"}, {name:"93号汽油"}, {name:"97号汽油"}, {name:"0号柴油"}, {name:"5号柴油"}, {name:"10号柴油"}, {name:"-10号柴油"}, {name:"-20号柴油"}, {name:"-35号柴油"}, {name:"-50号柴油"} ]}/>
                    <InputTextItem           object={Util.selectCar.carconfig[4]} autoCapitalize={'characters'} keyboardType={'numeric'} maxLength={19} onTextChangedListener={this.onTextChanged.bind(this)}/>
                    <InputTextItem           object={Util.selectCar.carconfig[5]} autoCapitalize={'characters'} keyboardType={'numeric'} maxLength={19} onTextChangedListener={this.onTextChanged.bind(this)}/>
                    <InputTextItem           object={Util.selectCar.carconfig[6]} autoCapitalize={'characters'} keyboardType={'numeric'} maxLength={19} onTextChangedListener={this.onTextChanged.bind(this)}/>
                    <SingleSelectionTextItem object={Util.selectCar.carconfig[7]} onSelectedListener={this.onSelected.bind(this)} optionArray={[{name:"国五"}, {name:"国四"}, {name:"国三"}, {name:"国二"}, {name:"国一"}]}/>
                    <SingleSelectionTextItem object={Util.selectCar.carconfig[8]} onSelectedListener={this.onSelected.bind(this)} optionArray={[{name:"AT"}, {name:"MT"}]}/>
                    <SingleSelectionTextItem object={Util.selectCar.carconfig[9]} onSelectedListener={this.onSelected.bind(this)} optionArray={[{name:"无"}, {name:"1个"}, {name:"2个"}, {name:"3个"}, {name:"4个"}, {name:"5个"}, {name:"6个"}, {name:"7个"}, {name:"8个"}, {name:"8个以上"}]}/>
                    <SingleSelectionTextItem object={Util.selectCar.carconfig[10]} onSelectedListener={this.onSelected.bind(this)} optionArray={[{name:"两驱"}, {name:"四驱"}, {name:"智能四驱"}, {name:"全时四驱"}]}/>
                    <SwitchTextItem          object={Util.selectCar.carconfig[11]} onValueChangedListener={this.onSelected.bind(this)} onValue='有' offValue='无' defaultState={true}/>
                    <SingleSelectionTextItem object={Util.selectCar.carconfig[12]} onSelectedListener={this.onSelected.bind(this)} optionArray={[{name:"合金"}, {name:"钢材"}]}/>
                    <CommonTextItem          object={Util.selectCar.carconfig[13]} onClickedListener={this.onOtherClicked.bind(this)} ref='otherItem' />
                </ScrollView>
                <NextButton onClickedListener={()=>this.clickedNew()}/>
            </View>
        );
    }

    clickedBack()
    {
        Actions.pop();
    }

    clickedNew()
    {
        Util.selectCar.basicinfo.travelkilometer.value = Util.selectCar.carconfig[1].value;
        Util.saveData('cars', Util.selectCar);
        Actions.CarFrame(
            {
                name:'CarFrame',
                component:CarFrame,
            }
        );
    }

    onSelected(){}

    onTextChanged(){}

    onOtherClicked()
    {
        Actions.CommonMultiListSelection(
            {
                title: '其他重要配置',
                name:'CommonMultiListSelection',
                component:CommonMultiListSelection,
                optionArray:[
                    "转向助力","电动车窗","天窗","空调","真皮座椅","电动反光镜","倒车雷达","倒车影像","定速巡航","电吸门","后排电动座椅","自动泊车","隔物板","座椅加热","一键启动","大灯清洗","导航","电动遮阳帘","多功能方向盘","DVD/CD","中控锁","电动座椅","底盘升降"],
                onResultListener:this.onOptionResult.bind(this),
                defaultValueArray:this.refs.otherItem.props.object.value
            }
        );
    }

    onOptionResult(resultArray)
    {
        this.refs.otherItem.props.object.value = resultArray;
        this.refs.otherItem.setState({
            v:resultArray.toString()
        });
    }
}
